<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/Test.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>dp.SyntaxHighlighter Tests</title>
<link type="text/css" rel="stylesheet" href="http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/SyntaxHighlighter.css">
</link>
<style>
.dp-highlighter {
	font-family: "Tahoma", "Courier", "Consolas", "Monaco", "Courier New", Courier, monospace;
	font-size: 12px;
	background-color: #E7E5DC;background-color: whitesmoke;
	width: 99%;
	overflow: auto;
	margin: 18px 0 18px 0 !important;
	padding-top: 1px; /* adds a little border on top when controls are hidden */
}
/* clear styles */
.dp-highlighter ol, .dp-highlighter ol li,.dp-highlighter ol li span {
	margin: 0;
	padding: 0;
	border: none;
}
.dp-highlighter a, .dp-highlighter a:hover {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
}
.dp-highlighter .bar {
	padding-left: 45px;
}
.dp-highlighter.collapsed .bar, .dp-highlighter.nogutter .bar {
	padding-left: 0px;
}
.dp-highlighter ol {
	list-style: decimal; /* for ie */
	background-color: #fff; 
	margin: 0px 0px 1px 45px !important; /* 1px bottom margin seems to fix occasional Firefox scrolling */
	padding: 0px;
	color: #5C5C5C;color:maroon;
}
.dp-highlighter.nogutter ol, .dp-highlighter.nogutter ol li {
	list-style: none !important;
	margin-left: 0px !important;
}
.dp-highlighter ol li, .dp-highlighter .columns div {
	list-style: decimal-leading-zero; /* better look for others, override cascade from OL */
	list-style-position: outside !important;
	border-left: 3px solid #6CE26C;border-left: 12px solid gray;
	background-color: #F8F8F8;
	color: #5C5C5C; 
	padding: 2px 3px 2px 10px !important;
	margin: 0 !important;
	line-height: 14px;
}

.dp-highlighter.nogutter ol li,
.dp-highlighter.nogutter .columns div
{
	border: 0;
}

.dp-highlighter .columns
{
	background-color: #fff;
	color: gray;
	overflow: hidden;
	width: 100%;
}

.dp-highlighter .columns div
{
	padding-bottom: 5px;
}

.dp-highlighter ol li.alt
{
	background-color: #FFF;background-color: #f1f1f1;
	color: inherit;
}

/* Adjust some properties when collapsed */

.dp-highlighter.collapsed ol
{
	margin: 0px;
}

.dp-highlighter.collapsed ol li
{
	display: none;
}

/* Additional modifications when in print-view */

.dp-highlighter.printing
{
	border: none;
}

.dp-highlighter.printing .tools
{
	display: none !important;
}

.dp-highlighter.printing li
{
	display: list-item !important;
}

/* Styles for the tools */

.dp-highlighter .tools
{
	padding: 3px 8px 3px 10px;
	font: 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: silver; 
	background-color: #f8f8f8;
	padding-bottom: 10px;
	border-left: 3px solid #6CE26C;border-left: 12px solid gray;
}

.dp-highlighter.nogutter .tools
{
	border-left: 0;
}

.dp-highlighter.collapsed .tools
{
	border-bottom: 0;
}

.dp-highlighter .tools a
{
	font-size: 9px;
	color: #a0a0a0;color: maroon;
	background-color: inherit; background-color:#eee;border:1px solid #444;padding:2px 5px;margin:0 1px !important;border-radius:3px;
	text-decoration: none;
	margin-right: 10px;
}

.dp-highlighter .tools a:hover
{
	color: red;
	background-color: inherit;
	text-decoration: underline;
}

/* About dialog styles */

.dp-about { background-color: #fff; color: #333; margin: 0px; padding: 0px; }
.dp-about table { width: 100%; height: 100%; font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; }
.dp-about td { padding: 10px; vertical-align: top; }
.dp-about .copy { border-bottom: 1px solid #ACA899; height: 95%; }
.dp-about .title { color: red; background-color: inherit; font-weight: bold; }
.dp-about .para { margin: 0 0 4px 0; }
.dp-about .footer { background-color: #ECEADB; color: red; border-top: 1px solid #fff; text-align: right; }
.dp-about .close { font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; background-color: #ECEADB; color: #333; width: 60px; height: 22px; }

/* Language specific styles */

.dp-highlighter .comment, .dp-highlighter .comments { color: #008200; color: #aaa;background-color: inherit; }
.dp-highlighter .string { color: blue; color:red;background-color: inherit; }

.dp-highlighter .preprocessor { color: gray; background-color: inherit; }

.dp-highlighter ol li span{ color: black; color:indigo;background-color: inherit;}
.dp-highlighter .keyword { color: #069;font-weight: bold; font-weight:normal;background-color: inherit; }
.dp-highlighter .dp-css .value{color:teal;}
.dp-highlighter .dp-xml .tag {font-weight: normal;}
.dp-highlighter .dp-xml .tag-name{color:royalblue;font-weight: normal;font-family:Times New Roman;font-size:120%;}
.dp-highlighter .dp-xml .cdata  { color: brown; }
.dp-highlighter .dp-xml .attribute-value { color:maroon; }
.dp-highlighter .dp-xml .attribute { color: darkcyan; }

</style>

</head>
<body>
<h1>dp.SyntaxHighlighter 1.5.2 Tests and Samples</h1>

	<div class="column2">
		<div class="block-box">Block before.</div>
		<!-- InstanceBeginEditable name="Code" -->
<pre name="code" class="css">
/* Main style for the table */

/* Issue #4 (http://code.google.com/p/syntaxhighlighter/issues/detail?id=4) */
a.button:active {  
	background-position: bottom right;
	background-position: top left;
}
/* end */

/* Issue #23 (http://code.google.com/p/syntaxhighlighter/issues/detail?id=23) */
a.button:active {  
	_background-position: bottom right;
	font-size: 23px;
}
/* end */
.dp-highlighter {
	font-family: "Courier New", Courier, mono;
	font-size: 12px;
	text-align: left;
	border: 1px solid #2B91AF;
	background-color: #fff;
	width: 99%;
	overflow: auto;
	line-height: 100% !important;
	margin: 18px 0px 18px 0px;
}
.dp-highlighter ol {
	margin: 0px 0px 0px 45px;
	padding: 0px;
	color: #2B91AF; 
}
.dp-highlighter ol li {
	border-left: 3px solid #6CE26C;
	border-bottom: 1px solid #eee;
	background-color: #fff;
	padding-left: 10px;
}
.dp-highlighter ol li.alt {
	background-color: #f8f8f8;
}
</pre>

<pre name="code" class="js">/* //&lt;![CDATA[ */
var GRonline = &#39;&#39;;

function update() {
    var docObj = window.frames[&#39;GR_preview&#39;].document;
    var textarea = document.getElementById(&#39;GR_editHere&#39;);

    if (GRonline != textarea.value) {
        GRonline = textarea.value
        docObj.open(&#39;text/html&#39;, &#39;replace&#39;);
        docObj.write(GRonline);
        docObj.close();
    }
    window.setTimeout(update, 150)
}
onload = function () {
    document.getElementById(&#39;GR_htmlEditor&#39;).style.display = &#39;inline&#39;;
    //document.getElementById(&#39;GR_editHere&#39;).select();
    update();
}
/* //]]&gt; */</pre>







<textarea name="code" class="xml" cols="60" rows="10">
&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&gt;
&lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;
&lt;head&gt;
&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot; /&gt;
&lt;title&gt;Untitled Document&lt;/title&gt;
&lt;/head&gt;

&lt;body&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
/* //&lt;![CDATA[ */
var GRonline = &#39;&#39;;

function update() {
    var docObj = window.frames[&#39;GR_preview&#39;].document;
    var textarea = document.getElementById(&#39;GR_editHere&#39;);

    if (GRonline != textarea.value) {
        GRonline = textarea.value
        docObj.open(&#39;text/html&#39;, &#39;replace&#39;);
        docObj.write(GRonline);
        docObj.close();
    }
    window.setTimeout(update, 150)
}
onload = function () {
    document.getElementById(&#39;GR_htmlEditor&#39;).style.display = &#39;inline&#39;;
    //document.getElementById(&#39;GR_editHere&#39;).select();
    update();
}
/* //]]&gt; */
&lt;/script&gt;

&lt;style type=&quot;text/css&quot;&gt;
.GR_Editor {
	margin:0 auto;
	background:#888;
	padding:10px 0;
	min-height:700px;
	position:relative;
}

.GR_Editor h2,
.GR_Editor h3 {
	font:bold 40px &quot;
	Times New Roman&quot;
	,Times,serif;
	text-align:center;
	margin:0;
	padding:0;
}

.GR_Editor h2 a:link,
.GR_Editor h3 {
	color:#ccc;
	text-decoration:none;
	display:block;
	text-shadow:-1px -1px 0 #fff,1px 1px 0 #555;
}

.GR_Editor h2 a:hover {
	color:#f00;
}

.GR_Editor h3 {
	font:bold 22px Georgia,&quot;
	Times New Roman&quot;
	,Times,serif;
	margin:10px 0 5px;
}

#GR_editHere,
#GR_preview {
	width:auto;
	width:100%;
	display:block;
	margin:0;
}
#GR_editHere {
	width:70%;
	min-width:400px;
	margin:0 auto;
	background:#ccc;
	padding:10px 5px 5px 12px;
	font:normal 12px Verdana,Tahoma,Arial;
	line-height:18px;
	border:2px solid #444;
	border-radius:8px;
	box-shadow:0 0 8px #fff;
}
#div_GR_preview {
	background:#fff;
	border:2px solid #aaa;
	height:auto;
	min-height:580px;
	max-width:100%;
	overflow:auto;
	resize:both;
	padding:0;
	margin:0;
}
#GR_preview {
	min-height:560px;
	width:100%;
	border:none;
}
.meongku {
	width:200px;
	margin:0 auto;
}
.meongku .clik {
	cursor:pointer;
}
a {
	outline:none !important;
}

.post .post-body:after {
	display:none;
}
&lt;/style&gt;

&lt;div id=&quot;GR_htmlEditor&quot; style=&quot;display: none&quot;&gt;
&lt;div class=&quot;GR_Editor&quot;&gt;
&lt;h2&gt;&lt;a href=&quot;http://gubhugreyot.blogspot.com&quot; target=&quot;_blank&quot;&gt;HTML Editor Online&lt;/a&gt;&lt;/h2&gt;
&lt;form&gt;
&lt;div class=&quot;meongku&quot;&gt;&lt;input class=&quot;clik&quot; onclick=&quot;javascript:this.form.GR_editHere.focus();this.form.GR_editHere.select();&quot; value=&quot;Select All&quot; type=&quot;button&quot;/&gt;&lt;input class=&quot;clik&quot; onclick=&quot;javascript:this.form.GR_editHere.value=&#39;&#39;;&quot; value=&quot;Clear&quot; type=&quot;button&quot;/&gt; &lt;/div&gt;
&lt;textarea name=&quot;ta&quot; id=&quot;GR_editHere&quot; rows=&quot;10&quot;&gt;
&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot; /&gt;

&lt;title&gt;Online HTML Editor&lt;/title&gt;

&lt;style type=&quot;text/css&quot;&gt;
.meong{
       padding:10px;
       background:lightblue;
       margin:10px 0;
       font-size:50px;
       letter-spacing:-1px;
}
.meong img{
       vertical-align:middle;
       margin-right:20px;
}
&lt;/style&gt;

&lt;/head&gt;

&lt;body&gt;

&lt;p class=&quot;meong&quot;&gt;&lt;a href=&quot;http://gubhugcss.blogspot.com&quot; target=&quot;_blank&quot; title=&quot;Ciluk....., baaaaa....!!!!!&quot;&gt;&lt;img src=&quot;https://lh6.googleusercontent.com/-QYGyo4MaOD4/UDAZ-88GC7I/AAAAAAAAAMw/IP-xTZN5NFg/s120/gambar-kucing-300x300.jpg&quot; width=&quot;120&quot; height=&quot;120&quot; alt=&quot;Kucing garong&quot; /&gt;&lt;/a&gt;Kucing Garong&lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt;
&lt;/textarea&gt;
&lt;/form&gt;
 &lt;h3&gt;Preview&lt;/h3&gt;
    &lt;div id=&quot;div_GR_preview&quot;&gt; 
 &lt;iframe src=&quot;javascript:&#39;&#39;&quot; name=&quot;GR_preview&quot; id=&quot;GR_preview&quot;&gt;
  &lt;p&gt; Sorry, your browser does not support the Real Time HTML editor. We recommend you upgrade your browser.&lt;/p&gt;
 &lt;/iframe&gt;
    &lt;/div&gt; 
&lt;/div&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;</textarea>






<!-- InstanceEndEditable -->
		<div class="block-box">Block after.</div>
	</div>
</div>
<div class="footer"> Copyright 2004-2008 Alex Gorbatchev.<br/>
</div>
<link href="http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/TestPages.css" rel="stylesheet" type="text/css" />
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js"></script>

<!--
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js"></script>
-->
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js"></script>

<!--
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js"></script>
-->

<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js"></script>

<!--
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js"></script>
-->

<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js"></script>

<!--
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushScala.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushGroovy.js"></script>
<script class="javascript" src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushBash.js"></script>
-->
<script class="javascript">
      if(window.isBloggerMode == true)
      dp.SyntaxHighlighter.BloggerMode();      
      dp.SyntaxHighlighter.ClipboardSwf = 'http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/clipboard.swf';
      dp.SyntaxHighlighter.HighlightAll('code');
    </script>
</body>
<!-- InstanceEnd --></html>
